<template>
  <div class="asset-list">
    <div class="asset-list-header">
      <span>{{ _t18('23_coin') }}</span>
      <span>{{ _t18('25_chiyou') }}</span>
    </div>
    <div class="asset-list-item" v-for="asset in assetDetails" :key="asset.symbol">
      <div class="asset-info">
        <img :src="asset.loge" :alt="asset.loge" class="asset-icon" />
        <span class="asset-symbol">{{ asset.title }}</span>
      </div>
      <div class="asset-balance">
        <div class="asset-amount">{{ asset.keyong }}</div>
       <!-- <div class="asset-value">≈${{ asset.keyong * priceFormat(tradeStore.allCoinPriceInfo[asset.icon]?.close) }}</div>-->
     <div class="asset-value">≈${{ getAssetValue(asset) }}</div>

	  </div>
    </div>
  </div>
</template>

<script setup>
import { useUserStore } from '@/store/user/index'
import { useMainStore } from '@/store'
import { storeToRefs } from 'pinia'
import { getFreezeList } from '@/api/user'
import { onMounted } from 'vue'
import { priceFormat, countFormat, currencyFormat } from '@/utils/decimal.js'
import { DIFF_FREEZE_ASSETS } from '@/config/index'
import { useTradeStore } from '@/store/trade/index'

const userStore = useUserStore()
// 平台资产,理财资产,合约资产
const mainStore = useMainStore()
const tradeStore = useTradeStore()

const assets = ref([])
// 用户余额信息
const { asset } = storeToRefs(userStore)
const assetDetails = computed(() => {
  let list = []
  //[{icon: 'usdt', title: 'USDT', keyong: 100, zhanyong: 100, zhehe: 100}]
  // console.log(asset.value)
  asset.value.forEach((item, index) => {
    // 之前两块多平台判断逻辑是一样的 -> 精简合并

    if (
      (item.type == 9 ) 
    ) {
      let obj = {}
      obj['keyong'] = priceFormat(item.availableAmount)
      // rxce冻结金额=占用+冻结
      if (DIFF_FREEZE_ASSETS.includes(__config._APP_ENV)) {
        let temp = 0
        if (freezeList.value) {
          freezeList.value.forEach((itm, inx) => {
            if (itm.coin == item.symbol && item.type == 1) {
              temp = itm.price
            }
          })
        }
        obj['zhanyong'] = priceFormat(_add(item.occupiedAmount, temp))
      } else {
        obj['zhanyong'] = priceFormat(item.occupiedAmount)
      }
      obj['zhehe'] = priceFormat(item.exchageAmount)
      if (item.symbol == 'usdt') {
        obj['icon'] = 'usdt'
      obj['loge'] = new URL('/static/img/1e8deac3f3e547629a8bf2b466dc0359.png', import.meta.url).href  // ✅ 本地图标
        obj['title'] = 'USDT'
        list.unshift(obj)
      } else {
        obj['loge'] = item.loge
        obj['title'] = item.symbol?.replace('usdt', '').trim().toLocaleUpperCase()
        obj['icon'] = item.symbol?.replace('usdt', '').trim()
        list.push(obj)
      }
    }
  })
  return list
})

// console.log(assetDetails.value)
const freezeList = ref()

// 获取冻结资产
const getAccountFreezeList = async () => {
  if (DIFF_FREEZE_ASSETS.includes(__config._APP_ENV)) {
    const res = await getFreezeList()
    if (res.code == '200') {
      freezeList.value = res.data
    }
  }
}

onMounted(() => {
  getAccountFreezeList()
})
// const assets = [
//   { symbol: 'ETH', icon: 'https://xinyuanimg-c.oss-cn-hongkong.aliyuncs.com/public/ede2393ae55247b686b96c38231d4676.png', amount: '22.5334', value: '83,990.093824' },
//   { symbol: 'BTC', icon: 'https://xinyuanimg-c.oss-cn-hongkong.aliyuncs.com/public/2089c85a1e9a4724b650b577eca51732.png', amount: '0.5', value: '59,479.510000' },
//   { symbol: 'BCH', icon: 'https://besteth.oss-cn-hongkong.aliyuncs.com/09fcfc35fd5244a29a78f701657aca4epng', amount: '0', value: '0.0000' },
//   { symbol: 'XRP', icon: 'https://xinyuanimg-c.oss-cn-hongkong.aliyuncs.com/public/04763b91be644060b5f9fb43306753b3.png', amount: '0', value: '0.0000' },
//   { symbol: 'DOGE', icon: 'https://xinyuanimg-c.oss-cn-hongkong.aliyuncs.com/public/d871ef0e09794c099828c2398dd20fdc.png', amount: '0', value: '0.0000' },
//   { symbol: 'ADA', icon: 'https://xinyuanimg-c.oss-cn-hongkong.aliyuncs.com/public/03ac33df0f9c44168043d79d4169a74b.png', amount: '0', value: '0.0000' },
//   { symbol: 'AXS', icon: 'https://xinyuanimg-c.oss-cn-hongkong.aliyuncs.com/public/ba7e6c46188f429c96ffcd7bb7131d6b.png', amount: '0', value: '0.0000' },
//   { symbol: 'ALICE', icon: 'https://xinyuanimg-c.oss-cn-hongkong.aliyuncs.com/public/f35b6304b24544bd8b62fa5da770139b.png', amount: '0', value: '0.0000' },
//   { symbol: 'APE', icon: 'https://xinyuanimg-c.oss-cn-hongkong.aliyuncs.com/public/5b3179e7e6bd408ba9eba265ab9519f5.png', amount: '0', value: '0.0000' },
//   // 新增币种
//   { symbol: 'GMT', icon: 'https://xinyuanimg-c.oss-cn-hongkong.aliyuncs.com/public/1498ca8227cd49d096304bb428816bfb.png', amount: '0', value: '0.0000' },
//   { symbol: 'SAND', icon: 'https://xinyuanimg-c.oss-cn-hongkong.aliyuncs.com/public/1607afaf334b4733aa8b11b1c1d8ce69.png', amount: '0', value: '0.0000' },
//   { symbol: 'MANA', icon: 'https://xinyuanimg-c.oss-cn-hongkong.aliyuncs.com/public/f90a1981b832433d93dffe65a1f5d624.png', amount: '0', value: '0.0000' },
//   { symbol: 'ENJ', icon: 'https://xinyuanimg-c.oss-cn-hongkong.aliyuncs.com/public/57b691aad563452da125c2ff96bad85a.png', amount: '0', value: '0.0000' },
//   { symbol: 'YGG', icon: 'https://xinyuanimg-c.oss-cn-hongkong.aliyuncs.com/public/c10c9f88b78149d290115209bb3ca961.png', amount: '0', value: '0.0000' },
//   { symbol: 'IMX', icon: 'https://xinyuanimg-c.oss-cn-hongkong.aliyuncs.com/public/2ec1f2a6445544ab92593e9e8ae7b2eb.png', amount: '0', value: '0.0000' },
//   { symbol: 'CHR', icon: 'https://xinyuanimg-c.oss-cn-hongkong.aliyuncs.com/public/adc7811c613748e99e3009502d560677.png', amount: '0', value: '0.0000' },
//   { symbol: 'OGN', icon: 'https://xinyuanimg-c.oss-cn-hongkong.aliyuncs.com/public/787ea8921241480684ed92f595c53624.png', amount: '0', value: '0.0000' },
//   { symbol: 'CHZ', icon: 'https://xinyuanimg-c.oss-cn-hongkong.aliyuncs.com/public/7a2eaed78bd9490499e52c764f871835.png', amount: '0', value: '0.0000' },
//   { symbol: 'USDT', icon: 'https://xinyuanimg-c.oss-cn-hongkong.aliyuncs.com/public/1e8deac3f3e547629a8bf2b466dc0359.png', amount: '0', value: '0.0000' },
// ]

// ✅ 修复 USDT 显示 ≈$ 为 0 的计算函数（保留原逻辑不变）
function getAssetValue(asset) {
  const price =
    asset.icon?.toLowerCase() === 'usdt'
      ? 1 // ✅ USDT 固定汇率
      : tradeStore.allCoinPriceInfo[asset.icon]?.close || 0
  return priceFormat(asset.keyong * price)
}



</script>

<style scoped>
.asset-list {
  background: #fff;
  border-radius: 12px;
  padding: 16px;
  margin-top: 24px;
}
.asset-list-header {
  display: flex;
  justify-content: space-between;
  font-weight: bold;
  color: #222;
  margin-bottom: 12px;
}
.asset-list-item {
  display: flex;
  justify-content: space-between;
  align-items: center;
  border-top: 1px solid #f0f0f0;
  padding: 12px 0;
}
.asset-info {
  display: flex;
  align-items: center;
}
.asset-icon {
  width: 32px;
  height: 32px;
  margin-right: 10px;
  border-radius: 50%;
  background: #f5f5f5;
}
.asset-symbol {
  font-size: 16px;
  color: #222;
}
.asset-balance {
  text-align: right;
}
.asset-amount {
  color: #7b9ca7;
  font-size: 15px;
}
.asset-value {
  color: #000;
  font-size: 14px;
}
</style> 